<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>js事件对象</title>
	<style>
	#fu{
		width: 400px;
		height: 400px;
		background: blue url() 0 0 no-repeat;
	}

	.son1{
		width: 200px;
		height: 200px;
		background: yellow url() 0 0 no-repeat;
	}

	.son2{
		width: 100px;
		height: 100px;
		background: green url() 0 0 no-repeat;
	}


	.qing{
		width: 200px;
		height: 100px;
		background-color: green;
		line-height: 100px;
	}



	</style>
	
	<script type="texe/javascript">
		window onload=function(){
			var son=document.getElementsByClassName('son1');

			son[1].onmouseover=function(){
				son[1].style.background="red";
			}

		}
	</script>

</head>
<body>
	<div id="fu">
		<div class="son1">
			<input type="text">
		</div>
		<div class="son2"></div>
	</div>
	

	<div class="qing" ><h2 onclick="this.innerHTML='谢谢！'">请移动鼠标至此</h2></div>
</body>
</html>